<template>
  <el-dialog
    @close="close"
    title="身份设置"
    :visible.sync="dialog"
    width="30%"
  >
    <el-form size="mini" :model="formInline" :rules="rules" ref="formInline" label-width="100px">
      <el-form-item label="用户昵称：" prop="operation" >
        <el-input v-model="formInline.operation" class="iden_inpu"></el-input>
      </el-form-item>
      <el-form-item label="用户ID：" prop="id" >
        <el-input v-model="formInline.id" class="iden_inpu"></el-input>
      </el-form-item>

      <el-form-item label="用户手机号：" prop="dictKey">
        <el-input v-model="formInline.dictKey" :disabled=keyDisable class="iden_inpu"></el-input>
      </el-form-item>
      <el-form-item label="身份：" prop="dictValue">
        <el-select v-model="formInline.nickName" placeholder="" class="iden_inpu">
          <el-option>普通用户</el-option>
          <el-option>公会主播</el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button :disabled="btnLoading" @click="dialog = false">取 消</el-button>
      <el-button type="primary" :loading="btnLoading" @click="onSubmit">确 定</el-button>
    </span>
  </el-dialog>

</template>
<script>
  //import {getDetailAPI,globalAddAPI } from '@/api/system/global_management'

  export default {
    name: 'Identity',

    props: {
      dialog_: {
        type: Boolean,
        default: false
      }
    },
    data() {
      var validateSort = (rule, value, callback) => {``
        var reg = /^[0-9]\d*$/
        if (value === null || value === '' | value === undefined) {
          callback()
        } else if (!reg.test(value)) {
          return callback(new Error('请输入正确的数字'))
        } else {
          callback()
        }
      }
      return {
        props: {
          label: 'title',
          children: 'children'
        },
        keyDisable:false,
        dialog: false,
        formInline: {
          id: '',
          operation: '',
          dictKey: '',
          dictValue: '',
          description: '',
          remark: ''
        },
        btnLoading: false,
        treeData: [],
        rules: {
          dictKey: [
            { required: true, message: '请填写业务配置名称', trigger: 'blur' }
          ],
          dictValue: [
            { required: true, message: '请填写业务配置值', trigger: 'blur' }
          ],
          description: [
            { required: true, message: '请填写描述', trigger: 'blur' }
          ],
          sort: [
            { validator: validateSort, trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      // 根据角色ID查询角色详情
      getGlobalDetails() {
        // getDetailAPI({ id: this.id }).then(res => {
        //   if (res.code === 200) {
        //     debugger
        //     this.formInline = res.data
        //   } else {
        //     this.$message.error(res.message)
        //   }
        // })
      },
      close() {
        this.$emit('close')
      },
      // 提交
      onSubmit() {
        // this.$refs.formInline.validate((valid) => {
        //   if (valid) {
        //     this.btnLoading = true
        //     globalAddAPI(this.formInline).then(res => {
        //       this.btnLoading = false
        //       if (res.code === 200) {
        //         this.$message.success(res.message)
        //         this.$emit('success')
        //         this.dialog = false
        //       } else {
        //         this.$message.error(res.message)
        //       }
        //     })
        //   } else {
        //     this.$message.warning("请填写完整的信息")
        //     return false;
        //   }
        // });

      },
    },
    mounted() {
      this.dialog = this.dialog_
    }
  }
</script>
<style>
  .iden_inpu{
    width:350px;
  }
</style>
